<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>新增岗位</title>
    <link href="./../resources/js/plugins/layui/css/layui.css" type="text/css" rel="stylesheet"  />
    <script type="text/javascript" src="./../resources/js/plugins/layui/layui.js"></script>
</head>
<body>
<div class="layui-fluid">
    <div class="layui-row layui-col-space5" >
        <div class="layui-col-sm3 ">
            <fieldset class="layui-elem-field">
                <legend>岗位模板</legend>
                <div class="layui-field-box">
                    <form class="layui-form">
                        <div class="layui-form-item " style="border: none;margin: 0px; padding: 0px;">

                                <div class=" layui-col-sm8">
                                    <input type="text"  name="search_jobname" id="search_jobname" placeholder="请输入" autocomplete="on" class="layui-input "   >
                                </div>
                                <div class="toolbars">
                                  <a id="flows_searchbtn" >
                                      <em class="ico16 search_16"></em>
                                      <span class="menu_span" title="查询">查询</span>
                                  </a>
                                </div>
                                <!-- <div class=" layui-col-sm3" style="padding: 5px 0px 0px 10px;">
                                    <a id="flows_searchbtn " class="layui-btn layui-btn-sm">
                                        <i class="layui-icon">&#xe615;</i>
                                    </a>
                                </div> -->
                        </div>
                    </form>
                    <table id="jobsTempTable" class="layui-table"  lay-filter="jobsTempTable"></table>
                </div>

            </fieldset>
        </div>
        <div class="layui-col-sm8 layui-col-sm-offset1">
            <form class="layui-form layui-form-pane" action="" style="padding:30px;" lay-filter="jobsForm" id="jobsForm">
                <div class="layui-form-item">

                    <label class="layui-form-label">招聘部门<span style="color: #ff0000">*</span></label>
                    <div class="layui-input-block">
                        <select name="JOBDEPART" id="JOBDEPART" lay-verify="required" multiple>
                            <option value="">请选择部门</option>

                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <input type="hidden" name="ID" />
                    <input type="hidden" name="FNAME" />
                        <label class="layui-form-label">岗位名称<span style="color: red">*</span></label>
                        <div class="layui-input-block">
                            <input type="text" name="JOBNAME" lay-verify="required" autocomplete="off" class="layui-input">
                        </div>
                </div>
                <div class="layui-form-item">
                        <label class="layui-form-label">招聘人数<span style="color: red">*</span></label>
                        <div class="layui-input-block">
                            <input type="text" name="ZPCOUNT" id="ZPCOUNT" lay-verify="required" placeholder="请输入招聘人数" autocomplete="off" class="layui-input">
                        </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">学历要求<span style="color: red">*</span></label>
                    <div class="layui-input-block">
                        <input type="hidden" id="EDCODE" name="EDCODE" />
                        <select name="EDUNAME" id="EDUNAME" lay-verify="required" multiple>
                            <option value=""></option>
                            <option value="博士研究生">博士研究生</option>
                            <option value="全日制硕士研究生">全日制硕士研究生</option>
                            <option value="普通全日制本科">普通全日制本科</option>
                            <option value="国民教育本科">国民教育本科</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">专业要求</label>
                    <div class="layui-input-block">
                        <textarea placeholder="请输入内容" class="layui-textarea" name="MAJOR"></textarea>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">资格条件</label>
                    <div class="layui-input-block">
                        <textarea placeholder="请输入内容"  class="layui-textarea" name="WORKREQ"></textarea>
                    </div>
                </div>
                <div class="layui-form-item">
                        <label class="layui-form-label">性别要求</label>
                        <div class="layui-input-block" pane="">
                                <input type="radio" name="GENDER" value="不限" title="不限" checked="">
                                <input type="radio" name="GENDER" value="男" title="男">
                                <input type="radio" name="GENDER" value="女" title="女" >
                        </div>
                </div>

                <div class="layui-form-item">
                        <label class="layui-form-label">年龄要求</label>
                            <div class="layui-input-inline" style="width: 100px;">
                                <input type="text" name="AGEF" placeholder="" autocomplete="off" class="layui-input">
                            </div>
                            <div class="layui-form-mid">-</div>
                            <div class="layui-input-inline" style="width: 100px;">
                                <input type="text" name="AGET" placeholder="" autocomplete="off" class="layui-input">
                            </div>
                </div>



                <div class="layui-form-item">
                        <label class="layui-form-label">身高要求</label>
                        <div class="layui-input-block">
                            <input type="text" name="HEIGHT" id="HEIGHT" lay-verify="" placeholder="填最低身高(单位:CM),无要求留空" autocomplete="off" class="layui-input">
                        </div>
                </div>
                <div class="layui-form-item">
                        <label class="layui-form-label">视力要求</label>
                        <div class="layui-input-block">
                            <input type="text" name="VISION" id="VISION" lay-verify="" placeholder="无要求请留空" autocomplete="off" class="layui-input">
                        </div>
                </div>
                <div  class="layui-form-item">
                    <label class="layui-form-label">工作年限</label>
                    <div class="layui-input-block">
                        <input type="text" name="WORKYEAR" id="WORKYEAR" lay-verify="" placeholder="填最低工龄(单位:年),无要求留空" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                            <label class="layui-form-label">工作内容</label>
                            <div class="layui-input-block">
                                <textarea placeholder="请输入内容" class="layui-textarea" name="WORKCONT"></textarea>
                            </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">另存为模板</label>
                    <div class="layui-input-block" pane="">
                        <input type="checkbox" checked="" name="ISTEMPLATE" lay-skin="switch" lay-filter="switchTemplate" lay-text="是|否">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">首页显示</label>
                    <div class="layui-input-block" pane="">
                        <input type="checkbox" checked="" name="DISPLAY" lay-skin="switch" lay-filter="switchDisplay" lay-text="是|否">

                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block" style="text-align: center">
                        <button class="layui-btn blue-btn" lay-submit="" lay-filter="btn_flow_add" style="background-color: #1E85EC;color: #fff;">保存</button>
                        <button type="reset" class="layui-btn layui-btn-primary" id="btn_flow_reset" >重置</button>
                    </div>
                </div>
            </form>
        </div>
    </div>

</div>
<script type="text/javascript" src="../../resources/js/plugins/layui_exts/multSelect/multiSelect.js"></script>
    <script>
        // 只需要引入multiSelect模块即可
        var index=parent.layer.getFrameIndex(window.name);
        var editData;


        layui.config({
            base: '../../resources/js/plugins/layui_exts/multSelect/'
        }).use(['multiSelect','form','table'],function(){
            var multiSelect = layui.multiSelect
                ,$=layui.$
                ,table=layui.table
                ,form=layui.form;
            // 如果异步操作了数据，比如在下拉项追加了一项，使用multiSelect.render(type, filter);type, filter参数跟layui官方的form.render(type, filter)一毛一样，可前往查看
            //multiSelect.render('EDUNAME', null);
            $.ajax({
                url:'../../resources/test/datas/jobsTemp.json',
                dataType:'JSON',
                type:'POST',
                success:function (json) {
                    flowData = json.data;
                    table.render({
                        elem: '#jobsTempTable',
                        id: 'jobsTempTable',
                        data: json.data,
                        page: false,
                        height: 'full',
                        defaultToolbar: [],
                        cols: [[ {field: 'ID', title: 'ID', width: 60, sort: false, hide: true}
                            , {field: 'TEMPNAME', title: '模板名称', sort: false, minWidth: 80}
                            , {field: 'JOBNAME', title: '岗位名称', sort: false, minWidth: 80}
                            , {field: 'ZPCOUNT', title: '招聘人数', minWidth: 80, hide: true}
                            , {field: 'WORKCONT', title: '工作内容', sort: false, hide: true, width: 90}
                            , {field: 'WORKREQ', title: '专业要求', minWidth: 100, hide: true}
                            , {field: 'HEIGHT', title: '身高', minWidth: 100, hide: true}
                            , {field: 'VISION', title: '视力', sort: false, hide: true}
                            , {field: 'WORKYEAR', title: '工作年限', sort: false, edit: 'text', hide: true}
                            , {field: 'AGEF', title: '年龄', sort: false, templet: '#jobsAgeTpl', hide: true}
                            , {field: 'AGET', title: '年龄', sort: false, hide: true, hide: true}
                            , {field: 'EDUCODE', title: '学历编码', sort: false, hide: true}
                            , {field: 'EDUNAME', title: '学历名称', sort: false, hide: true}
                            , {field: 'MAJOR', title: '所学专业', sort: false, hide: true}
                            , {field: 'ISTEMPLATE', title: '是否模版', sort: false, hide: true}
                        ]]
                    });
                }
            });
                table.on('row(jobsTempTable)', function(obj){
                   // console.log(obj.tr) //得到当前行元素对象
                   // console.log(obj.data) //得到当前行数据
                    //obj.del(); //删除当前行
                    //obj.update(fields) //修改当前行数据
                    var selectData=obj.data;
                    form.val('jobsForm',{
                        "JOBNAME": selectData.JOBNAME // "name": "value"
                        ,"ZPCOUNT": selectData.ZPCOUNT
                        ,"WORKCONT":selectData.WORKCONT
                        ,"WORKREQ": selectData.WORKREQ
                        ,"HEIGHT": selectData.HEIGHT
                        ,"VISION": selectData.VISION
                        ,"WORKYEAR": selectData.WORKYEAR
                        ,"AGEF": selectData.AGEF
                        ,"AGET": selectData.AGET
                        ,"EDUCODE": selectData.EDUCODE
                        ,"EDUNAME": selectData.EDUNAME
                        ,"MAJOR": selectData.MAJOR
                        ,"ISTEMPLATE": selectData.ISTEMPLATE
                    });
                    form.render();
                    multiSelect.render('EDUNAME', null);
                });

            form.on('submit(btn_flow_add)', function(data){
                console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}
               var tabledatas= parent.layui.table.cache['jobsTable'];
                var hasjob=false;
                var hasIndex=1;
                $.each(tabledatas,function(e,t) {
                    if (t.JOBNAME==editData.JOBNAME){
                        hasjob=true;
                        hasIndex=e;
                    }
                });
                if(!!editData){
                    tabledatas[hasIndex]=data.field;
                    parent.layui.table.cache['jobsTable'][hasIndex]=data.field;
                    parent.layui.table.reload('jobsTable',{data:tabledatas});
                    parent.layer.close(index);
                }else{
                    if(hasjob){
                        layer.alert('已存在该岗位,请更换岗位名称!',{icon:5});
                    }else{
                        tabledatas.splice(hasIndex+1, 0, data.field);
                        parent.layui.table.cache['jobsTable']=tabledatas;
                        parent.layui.table.reload('jobsTable',{data:tabledatas});
                        parent.layer.close(index);
                    }
                }
                return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
            });
            if(!!editData){
                editJob(editData);
            }
            function editJob(cdata) {
                layui.form.val('jobsForm',{
                    "JOBNAME": cdata.JOBNAME // "name": "value"
                    ,"ZPCOUNT": cdata.ZPCOUNT
                    ,"WORKCONT":cdata.WORKCONT
                    ,"WORKREQ": cdata.WORKREQ
                    ,"HEIGHT": cdata.HEIGHT
                    ,"VISION": cdata.VISION
                    ,"WORKYEAR": cdata.WORKYEAR
                    ,"AGEF": cdata.AGEF
                    ,"AGET": cdata.AGET
                    ,"EDUCODE": cdata.EDUCODE
                    ,"EDUNAME": cdata.EDUNAME
                    ,"MAJOR": cdata.MAJOR
                    ,"ISTEMPLATE": cdata.ISTEMPLATE
                });
                layui.form.render();
            }
        });


    </script>
</body>
</html>